<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>css盒子模型</title>
</head>
<body>
    <div class="box">
        <img src="https://via.placeholder.com/300x300" alt="Example Image">
    </div>
</body>
<style type="text/css">
    .box {
        width: 200px; /* 固定宽度 */
        height: 100px; /* 固定高度 */
        border: 3px solid red; /* 添加边框 */
        background-color: #f0f0f0; /* 设置背景颜色 */
        overflow: scroll;
        /*
        overflow: scroll;（滚动条）
        overflow: auto;（自动处理）
        overflow: visible;（可见）
        overflow: hidden;（隐藏）
        */
    }

    img {
        width: 400px; /* 图片宽度超过盒子宽度 */
        height: 200px; /* 图片高度超过盒子高度 */
    }
</style>
</html>
